import GraphBack from '../../src'
function draw() {
  document.querySelectorAll('.graph-background').forEach((ele) => drawBackground(ele))
}
window.addEventListener('resize', () => draw())

function drawBackground(ele) {
  const board = new GraphBack.Board(ele, { create: true, color: '#235fa7' })
  const pointStr = `40,0 5,0 0,5 0,16 3,19 3,7 7,3 35,3`
  const points = pointStr.split(' ').map((item) => item.split(','))
  const graph = new GraphBack.Polygon({ points, x: 5, y: 5 })
  const transform = new GraphBack.Transform(graph)
    .mirror('x', board.width / 2 - 5, 0)
    .mirror('y', 0, board.height / 2 - 5)
  board.add(transform)
  const rect = new GraphBack.Rect({ x: 8, y: 8, width: board.width - 16, height: board.height - 16, fill: false })
  board.add(rect)
  board.render()
}
